﻿<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<link rel="stylesheet" type="text/css" href="style/css/index.css" />
	<script type="text/javascript">
		function gopage(num) {
			var f=document.getElementById("ff");
			f.action="/menu_ui/[[${session.desk.id}]]/"+num;
			f.submit();
		}

		function chooseType(type_id) {
			document.getElementById("type_id").value=type_id;
			gopage(1);
		}
		// 修改菜品项数量
		function alterSorder(node,cart_id) {
			var snumber = node.value;
			window.location.href ="/updateCartNumber/"+cart_id+"/"+snumber
		}
		function removeSorder(cart_id) {
			if (confirm("确定要删除吗？")){
				window.location.href = "/deleteCart/"+cart_id;
			}
		}
		// 下单
		function genernateOrder() {
			window.location.href = "/genernateOrder";
		}
	</script>
</head>

<body style="text-align: center">
	<div id="all">
		<div id="menu">
			<!-- 餐车div -->
			<div id="count">
				<table align="center" width="100%">
					<tr height="40">
				 		<td align="center" width="20%">菜名</td>
				 		<td align="center" width="20%">单价</td>
				 		<td align="center" width="20%">数量</td>
				 		<td align="center" width="20%">小计</td>
				 		<td align="center" width="20%">操作</td>
				 	</tr>
					<tr height="60" th:each="cart:${carts}">
					 		<td align="center" width="20%" th:text="${cart.food.title}">烤乳猪</td>
					 		<td align="center" width="20%">￥<span th:text="${cart.food.price}">68.0</span></td>
					 		<td align="center" width="20%">
					 			<input type="text" value="1" th:value="${cart.num}" size="3" lang="3" th:onblur="|alterSorder(this,${cart.id})|"/>
					 		</td>
					 		<td align="center" width="20%" th:text="${cart.total}">68.0</td>
					 		<td align="center" width="20%">
					 			<input type="button" value="删除" class="btn_next" lang="3" th:onclick="|removeSorder(${cart.id})|" />
					 		</td>
				 	</tr>

					<tr>
						<td colspan="6" align="right">总计:
							<span style="font-size:36px;">&yen;&nbsp;[[${sum}]]</span>
							<label
								id="counter" style="font-size:36px"></label>
						</td>
					</tr>
					<tr>
						<td colspan="6" style="margin-left: 100px; text-align: center;"align="right">
							<input type="hidden" name="bId" value="">
							<input type="button" value="下单" class="btn_next" th:onclick="genernateOrder()" />
						</td>
					</tr>
				</table>
			</div>
		</div>

		<!-- 右边菜系列表，菜品搜索框  -->
		<div id="dish_class">
			<div id="dish_top">
				<ul>
					<li class="dish_num"></li>
					<li>
						<a href="/my_carts">
							<img src="/style/images/call2.gif" />
						</a>
					</li>
				</ul>
			</div>

			<div id="dish_2">
				<ul>
					<li th:each="type:${foodTypes}">
						<a th:href="|javascript:chooseType(${type.id});|" th:class="${type.id==type_id}? b" th:text="${type.name}">粤菜</a>
					</li>
				</ul>
			</div>
			<div id="dish_3">
				<!-- 搜索菜品表单  -->
				<form action="#" method="post">
					<table width="166px">
						<tr>
							<td>
							</td>
						</tr>
						<tr>
							<td>

							</td>
						</tr>
						<tr>
							<td>
								<span style="color: red;font-weight: bold" th:text="|${session.desk.name}餐桌|"></span>
								<a href="#">
									<img src="/style/images/look.gif" />
								</a>
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>
		</div>
	</div>
</body>
</html>
